﻿@{
    ViewData["Title"] = "首 页";
}
@{
    var token = Context.Request.Cookies["token"];
}
@section Scripts {
    <script>
        var baseURL = "https://localhost:44313";

        $(".box-bottom").css("visibility","visible"); //显示导航栏
        $(".box").removeAttr("frosted"); //移除背景图

        function GetPrizesQuery(){
            $.ajax({
                url: baseURL+'/api/Lottery/GetPrizesQueryAsync',
                type: 'get',
                success: function(res){

                    if(res.code == 200){
                        $('.box-content-Prizes').empty(); //清除该类下的所有元素

                        res.data.map(x =>{
                            var dom = `<div class="Prizes-Prize">
                                            <img src="${x.prizeImagePath}" alt="${x.prizeName}" class="img">
                                            <div class="Prize-Num">当前数量: ${x.prizeCount}</div>
                                            <div class="Prize-Name font_bold">${x.prizeName}</div>
                                       </div>`;
                            $('.box-content-Prizes').append(dom);
                        })
                    }
                }
            })
        }

        GetPrizesQuery(); //初始化首页数据

        layui.use(['layer'], function(){
            var layer = layui.layer;
            //开始抽奖
            $(document).on('click','.box-content-start', function(){
                
                $.get('/Home/StartLottery', function(res){
                    if(res.code == 200){
                        layer.msg('恭喜您获得了：'+ res.data + '！')
                        GetPrizesQuery();
                    }
                    if(res.code ==203){ //用户积分不足
                        layer.msg(res.msg);
                    }
                })
            })
        })
    </script>
}

<div class="box-Headr">
    <div class="box-headr-title font_bold" data-content="展览巡游 -- 打卡有奖">展览巡游 -- 打卡有奖</div>
</div>
<div class="box-content">
    <div class="box-content-headr font_bold">奖品列表</div>

    <div class="box-content-Prizes"></div>

    <div class="box-content-start font_bold">点一下进行抽奖（消耗25积分）</div>
</div>

@if (string.IsNullOrEmpty(token))
{
    <div class="box-bottom-Login frosted_glass">登录</div>
}
